<template>
    <el-form class="form">

        <el-row>
            <el-col :span="22">
                <el-form-item label="1.被保险人的职业是否涉及或接触任何危险物(化学物质、爆炸物、有毒物质或其他危险物)、室外作业或重体力劳动、高空
                      作业、潜水或水下作业、隧道坑道或井下作业及其它危险职业或工作？">
                </el-form-item>
            </el-col>
            <el-col :span="2">
                <el-form-item>
                    <el-radio-group v-model="form.QUESTION1" :disabled="!(Ftype=='新增' || Ftype=='修改' || Ftype=='提交')">
                        <el-radio label="是"></el-radio>
                        <el-radio label="否"></el-radio>
                    </el-radio-group>
                </el-form-item>
            </el-col>
        </el-row>
        <el-row>
            <el-col :span="22">
                <el-form-item label="2. 被保险人是否正在或试图参加私人性质飞行、赛马、竞马、潜水、登山攀登或从事其它危险性运动？">

                </el-form-item>
            </el-col>
            <el-col :span="2">
                <el-form-item>
                    <el-radio-group v-model="form.QUESTION2" :disabled="!(Ftype=='新增' || Ftype=='修改' || Ftype=='提交')">
                        <el-radio label="是"></el-radio>
                        <el-radio label="否"></el-radio>
                    </el-radio-group>
                </el-form-item>
            </el-col>
        </el-row>
        <el-row>
            <el-col :span="22">
                <el-form-item label="3. 被保险人是否持有机动车驾驶执照？">

                </el-form-item>
            </el-col>
            <el-col :span="2">
                <el-form-item>
                    <el-radio-group v-model="form.QUESTION3" :disabled="!(Ftype=='新增' || Ftype=='修改' || Ftype=='提交')">
                        <el-radio label="是"></el-radio>
                        <el-radio label="否"></el-radio>
                    </el-radio-group>
                </el-form-item>
            </el-col>
        </el-row>
        <el-row v-show="form.QUESTION3=='是'">
            <el-col :span="1">
                <el-form-item>
                </el-form-item>
            </el-col>
            <el-col :span="15">
                <el-form-item label="若有，请填写驾照类型：" label-width="200px">
                    <el-input v-model="form.QUESTION3_TYPE" :disabled="!(Ftype=='新增' || Ftype=='修改' || Ftype=='提交')"></el-input>
                </el-form-item>
            </el-col>

        </el-row>
        <el-row v-show="form.QUESTION3=='是'">
            <el-col :span="1">
                <el-form-item>
                </el-form-item>
            </el-col>
            <el-col :span="15">
                <el-form-item label="3.1 被保险人是否因驾车而发生过意外交通事故？ ">

                </el-form-item>
            </el-col>
            <el-col :span="8">
                <el-radio-group v-model="form.QUESTION3_1" :disabled="!(Ftype=='新增' || Ftype=='修改' || Ftype=='提交')">
                    <el-radio label="是"></el-radio>
                    <el-radio label="否"></el-radio>
                </el-radio-group>
            </el-col>
        </el-row>
        <el-row v-show="form.QUESTION3_1=='是'">
            <el-col :span="1">
                <el-form-item>
                </el-form-item>
            </el-col>
            <el-col :span="15">
                <el-form-item label="若是，请详述：">
                    <el-input type="textarea" v-model="form.QUESTION3_1_CONTENT" :disabled="!(Ftype=='新增' || Ftype=='修改' || Ftype=='提交')"></el-input>
                </el-form-item>
            </el-col>
        </el-row>
        <el-row>
            <el-col :span="22">
                <el-form-item label="4. 被保险人的户籍所在地与投保地是否为同一地？">
                </el-form-item>
            </el-col>
            <el-col :span="2">
                <el-form-item>
                    <el-radio-group v-model="form.QUESTION4" :disabled="!(Ftype=='新增' || Ftype=='修改' || Ftype=='提交')">
                        <el-radio label="是"></el-radio>
                        <el-radio label="否"></el-radio>
                    </el-radio-group>
                </el-form-item>
            </el-col>
        </el-row>
        <el-row v-show="form.QUESTION4=='否'">
            <el-col :span="1">
                <el-form-item>
                </el-form-item>
            </el-col>
            <el-col :span="15">
                <el-form-item label="4.1 若否，被保险人在投保地居住时间： ">

                </el-form-item>
            </el-col>
            <el-col :span="8">
                <el-radio-group v-model="form.QUESTION4_1" :disabled="!(Ftype=='新增' || Ftype=='修改' || Ftype=='提交')">
                    <el-radio label="小于 1 年"></el-radio>
                    <el-radio label="大于等于 1 年"></el-radio>
                </el-radio-group>
            </el-col>
        </el-row>
        <el-row v-show="form.QUESTION4=='否'">
            <el-col :span="1">
                <el-form-item>
                </el-form-item>
            </el-col>
            <el-col :span="15">
                <el-form-item label="4.2 若否，被保险人有投保地的： ">

                </el-form-item>
            </el-col>
            <el-col :span="8">
                <el-radio-group v-model="form.QUESTION4_2" :disabled="!(Ftype=='新增' || Ftype=='修改' || Ftype=='提交')">
                    <el-radio label="居住证"></el-radio>
                    <el-radio label="暂住证"></el-radio>
                </el-radio-group>
            </el-col>
        </el-row>
        <el-row v-show="form.QUESTION4=='否'">
            <el-col :span="1">
                <el-form-item>
                </el-form-item>
            </el-col>
            <el-col :span="15">
                <el-form-item label="4.3 若否，被保险人来投保地的目的：">

                </el-form-item>
            </el-col>
            <el-col :span="8">
                <el-radio-group v-model="form.QUESTION4_3" :disabled="!(Ftype=='新增' || Ftype=='修改' || Ftype=='提交')">
                    <el-radio label="工作"></el-radio>
                    <el-radio label="探亲"></el-radio>
                    <el-radio label="旅游"></el-radio>
                    <el-radio label="其他"></el-radio>
                </el-radio-group>
            </el-col>
        </el-row>
        <el-row v-show="form.QUESTION4=='否'">
            <el-col :span="1">
                <el-form-item>
                </el-form-item>
            </el-col>
            <el-col :span="15">
                <el-form-item label="4.4 若否，在投保地的住所：">

                </el-form-item>
            </el-col>
            <el-col :span="8">
                <el-radio-group v-model="form.QUESTION4_4" :disabled="!(Ftype=='新增' || Ftype=='修改' || Ftype=='提交')">
                    <el-radio label="自有房产"></el-radio>
                    <el-radio label="其他"></el-radio>
                </el-radio-group>
            </el-col>
        </el-row>
        <el-row>
            <el-col :span="22">
                <el-form-item label="5. 被保险人是否已购买或正在准备购买人寿保险、人身意外保险或健康保险？">

                </el-form-item>
            </el-col>
            <el-col :span="2">
                <el-form-item>
                    <el-radio-group v-model="form.QUESTION5" :disabled="!(Ftype=='新增' || Ftype=='修改' || Ftype=='提交')">
                        <el-radio label="是"></el-radio>
                        <el-radio label="否"></el-radio>
                    </el-radio-group>
                </el-form-item>
            </el-col>
        </el-row>
        <el-row v-show="form.QUESTION5=='是'">
            <el-col :span="1">
                <el-form-item>
                </el-form-item>
            </el-col>
            <el-col :span="19">
                <el-form-item label="若是，请详述:">
                    <el-input type="textarea" v-model="form.QUESTION5_CONTENT" :disabled="!(Ftype=='新增' || Ftype=='修改' || Ftype=='提交')"></el-input>
                </el-form-item>
            </el-col>

        </el-row>
        <el-row>
            <el-col :span="22">
                <el-form-item label="6. 被保险人的人寿保险、人身意外保险或健康保险是否曾经被拒保、延迟、加费或作任何形式的修改？">

                </el-form-item>
            </el-col>
            <el-col :span="2">
                <el-form-item>
                    <el-radio-group v-model="form.QUESTION6" :disabled="!(Ftype=='新增' || Ftype=='修改' || Ftype=='提交')">
                        <el-radio label="是"></el-radio>
                        <el-radio label="否"></el-radio>
                    </el-radio-group>
                </el-form-item>
            </el-col>
        </el-row>
        <el-row v-show="form.QUESTION6=='是'">
            <el-col :span="1">
                <el-form-item>
                </el-form-item>
            </el-col>
            <el-col :span="19">
                <el-form-item label="若是，请详述：">
                    <el-input type="textarea" v-model="form.QUESTION6_CONTENT" :disabled="!(Ftype=='新增' || Ftype=='修改' || Ftype=='提交')"></el-input>
                </el-form-item>
            </el-col>
        </el-row>
        <el-row>
            <el-col :span="22">
                <el-form-item label="7. 被保险人是否曾经向任何保险公司提出索赔申请？">

                </el-form-item>
            </el-col>
            <el-col :span="2">
                <el-form-item>
                    <el-radio-group v-model="form.QUESTION7" :disabled="!(Ftype=='新增' || Ftype=='修改' || Ftype=='提交')">
                        <el-radio label="是"></el-radio>
                        <el-radio label="否"></el-radio>
                    </el-radio-group>
                </el-form-item>
            </el-col>
        </el-row>
        <el-row v-show="form.QUESTION7=='是'">
            <el-col :span="1">
                <el-form-item>
                </el-form-item>
            </el-col>
            <el-col :span="19">
                <el-form-item label="若是，请详述事故原因及索赔结果：">
                    <el-input type="textarea" v-model="form.QUESTION7_CONTENT" :disabled="!(Ftype=='新增' || Ftype=='修改' || Ftype=='提交')"></el-input>
                </el-form-item>
            </el-col>
        </el-row>
    </el-form>
</template>

<script>
import { mapState } from "vuex";
import getid from "@/js/getid";
export default {
  data() {
    return {
      form: {
        QUESTION_ID: "",
        QUESTION1: "",
        QUESTION2: "",
        QUESTION3: "",
        QUESTION3_TYPE: "",
        QUESTION3_1: "",
        QUESTION3_1_CONTENT: "",
        QUESTION4: "",
        QUESTION4_1: "",
        QUESTION4_2: "",
        QUESTION4_3: "",
        QUESTION4_4: "",
        QUESTION5: "",
        QUESTION5_CONTENT: "",
        QUESTION6: "",
        QUESTION6_CONTENT: "",
        QUESTION7: "",
        QUESTION7_CONTENT: ""
      }
    };
  },
  props: {
    Ftype: {
      type: String,
      default: ""
    }
  },
  computed: mapState({
    saleDetail: state => state.SealDetail.model
  }),
  methods: {
    reload() {
      if (this.Ftype == "新增") {
        this.form.QUESTION_ID = getid.getid();
        this.saleDetail.QUESTION_ID = this.form.QUESTION_ID;
        this.saleDetail.QUESTION = this.form;
      } else {
        this.form = this.saleDetail.QUESTION;
      }
    }
  },
  created() {
    this.reload();
  }
};
</script>

<style scope>
.form {
  font-size: 14px !important;
}

.el-radio__label {
  font-size: 13px !important;
}

input {
  max-width: 200px;
}

.el-tabs__content {
  padding: 7px !important;
}
</style>
